<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Host_Compare</title>
</head>
<style type="text/css">
	.head{
		top:0px;
		left: 0px;
		width: 100%;
		height: 80px;
		position: absolute;
		background-color: #232d3b;
	}
	.imglogo{
		top:27px;
		left: 306px;
		position: absolute;
	}
	.host{
		top:23px;
		left: 340px;
		position: absolute;
		font-size: 20px;
		font-weight: bolder;
	}
	.compare{
		top:23px;
		left: 398px;
		position: absolute;
		font-size: 20px;
		font-weight:3px;
	}
	.comparehosting{
		top:32px;
		left: 664px;
		position: absolute;
		font-size: 10px;
		font-weight:3px;
	}
	.abouit{
		top:32px;
		left: 870px;
		position: absolute;
		font-size: 10px;
		font-weight:3px;
	}
	.how{
		top:32px;
		left: 952px;
		position: absolute;
		font-size: 10px;
		font-weight:3px;
	}
	.Contact{
		top:32px;
		left: 1073px;
		position: absolute;
		font-size: 10px;
		font-weight:3px;
	}
	.signup{
		width:103px;
		height:46px;
		top:15px;
		left:1153px;
		position:absolute;
		font-size:15px;
		background-color:#a3d39c;
		text-align:center;
		line-height:40px;
		border-radius:5px;
	}
	.org{
		top:80px;
		left: 0px;
		width: 100%;
		height: 728px;
		position: absolute;
		background-color: #ff742c;
	}
	.findright{
		top:75px;
		left:400px;
		position: absolute;
		font-size: 38px;
	}
	.fluffywhite{
		top:135px;
		left:600px;
		position: absolute;
		font-size: 38px;
	}
	.chatspan{
		top:230px;
		left:20px;
		width:72px;
		height:62px;
		position: absolute;
		background-color: #36aaa4;
		border-radius: 5px;
	}
	.imgchat{
		top:20px;
		left:20px;
		position: absolute;
	}
	.mailspan{
		top:291px;
		left:20px;
		width:72px;
		height:62px;
		position: absolute;
		background-color: #80d3cf;
		border-radius: 5px;
	}
	.heartspan{
		top:353px;
		left:20px;
		width:72px;
		height:62px;
		position: absolute;
		background-color: #36aaa4;
		border-radius:5px;
	}
	.cloudimg{
		top:230px;
		left:500px;
		position: absolute;
	}
	.arrowleftspan{
		top:385px;
		left:234px;
		position: absolute;
	}
	.arrowrightspan{
		top:401px;
		left:1200px;
		position: absolute;
	}
	.amountin{
		top:567px;
		left:465px;
		width:247px;
		height:52px;
		position: absolute;
		font-size: 16px;
	}
	.ico1img{
		top:605px;
		left: 485px;
		position: absolute;
	}
	.arrowdownspan{
		top:567px;
		left:696px;
		width:58px;
		height:58px;
		position: absolute;
		background-color: #7accc8;
		border-radius:5px;
	}
	.arrowdownimg{
		top:20px;
		left:20px;
		position: absolute;
	}
	.operatingsy{
		top:567px;
		left:784px;
		width:247px;
		height:52px;
		position: absolute;
		font-size: 16px;
	}
	.ico2img{
		top:605px;
		left: 800px;
		position: absolute;
	}
	.arrowdownspan2{
		top:567px;
		left:1035px;
		width:58px;
		height:58px;
		position: absolute;
		background-color: #7accc8;
		border-radius:5px;
	}
	.fontbg{
		top:637px;
		left:624px;
		width:300px;
		height:68px;
		position: absolute;
		background-color: #7accc8;
		font-size: 20px;
		text-align: center;
		border-radius: 5px;
		line-height: 60px;
	}
	.whitediv{
		top:806px;
		left: 0px;
		width: 100%;
		height: 698px;
		position: absolute;
		background-color: #f6f5f2;
	}
	.weuse100{
		top:57px;
		left: 306px;
		font-size: 22px;
		position: absolute;
		font-family: "微软雅黑";
	}
	.wedont{
		top:57px;
		left: 786px;
		font-size: 22px;
		position: absolute;
		font-family: "微软雅黑";
	}
	.gitiseasy{
		top:101px;
		left:306px;
		height:84px;
		width:457px;
		font-size:15px;
		position: absolute;
	}
	.gitallowsand{
		top:101px;
		left:786px;
		height:100px;
		width:457px;
		font-size:15px;
		position: absolute;
	}
	.notablywhen{
		top:220px;
		left:306px;
		height:156px;
		width:457px;
		font-size:15px;
		position: absolute;
	}
	.butthe{
		top:171px;
		left:786px;
		height:62px;
		width:457px;
		font-size:15px;
		position: absolute;
	}
	.thedocuement{
		top:271px;
		left:786px;
		height:88px;
		width:457px;
		font-size:15px;
		position: absolute;
	}
	.btn1img{
		top:500px;
		left:306px;
		position: absolute;
	}
	.btn2img{
		top:500px;
		left:545px;
		position: absolute;
	}
	.btn3img{
		top:463px;
		left:788px;
		position: absolute;
	}
	.btn4img{
		top:500px;
		left:1023px;
		position: absolute;
	}
	.dbab5{
		top:1505px;
		left: 0px;
		width: 100%;
		height: 684px;
		position: absolute;
		background-color: #5dbab5;
	}
	.f6f5f2{
		top:2186px;
		left: 0px;
		width: 100%;
		height: 497px;
		position: absolute;
		background-color: #f6f5f2;
	}
</style>
<body>
<div class="head">
	<img class="imglogo"                                                 src="C:\Users\Administrator\Desktop\demo\image-demo2\logo.png" />
	<span class="host" style="color:#ffffff">HOST</span>
	<span class="compare" style="color:#ffffff">COMPARE</span>
	<span class="comparehosting" style="color:#ffffff">Compare Hosting Providers</span>
	<span class="abouit" style="color:#555b63">Abouit</span>
	<span class="how" style="color:#555b63">How it Works</span>
	<span class="Contact" style="color:#555b63">Contact</span>
	<span class="signup" style="color:#ffffff">+ Sign Up</span>
</div>
<div class="org">
	<span class="findright" style="color:#ffffff">Find the right cloud Hosting Without the</span>
	<span class="fluffywhite" style="color:#ffffff">Fluffy White stuff.</span>
	<span class="chatspan">
		<img class="imgchat" src="C:\Users\Administrator\Desktop\demo\image-demo2\chat.png">
	</span>
	<span class="mailspan">
		<img class="imgchat" src="C:\Users\Administrator\Desktop\demo\image-demo2\mail.png">
	</span>
	<span class="heartspan">
		<img class="imgchat" src="C:\Users\Administrator\Desktop\demo\image-demo2\heart.png">
	</span>
	<img class="cloudimg" src="C:\Users\Administrator\Desktop\demo\image-demo2\cloud.png">
	<img class="arrowleftspan" src="C:\Users\Administrator\Desktop\demo\image-demo2\arrowleft.png">
	<img class="arrowrightspan" src="C:\Users\Administrator\Desktop\demo\image-demo2\arrowright.png">
	<span>
		<input class="amountin" style="color: #7accc8" type="text" name="amount" placeholder="           Diskspace Amount" />
		<img class="ico1img" src="C:\Users\Administrator\Desktop\demo\image-demo2\ico1.png">
		<span class="arrowdownspan"><img class="arrowdownimg" src="C:\Users\Administrator\Desktop\demo\image-demo2\arrowdown.png"></span>
		<input class="operatingsy" style="color: #7accc8" type="text" name="operating" placeholder="           Operating System">
		<img class="ico2img" src="C:\Users\Administrator\Desktop\demo\image-demo2\ico2.png">
		<span class="arrowdownspan2"><img class="arrowdownimg" src="C:\Users\Administrator\Desktop\demo\image-demo2\arrowdown.png"></span>
	</span>
	<span class="fontbg" style="color:#ffffff">+ Get quote Now</span>
</div>
<div class="whitediv">
	<span class="weuse100">We use 100% Real Clouds</span>
	<span class="wedont">We don't hurt Kittens</span>
	<div class="gitiseasy" style="color: #ff7931">Git is easy to learn and has a tiny footprint with lightning fast performance. It outclasses SCM tools like Subversion, CVS, Perforce, and ClearCase with features like cheap local branching, convenient staging workflows.</div>
	<div class="gitallowsand" style="color: #ff7931">Git allows and encourages you to have multiple local branches that can be entirely independent of each other.
	</div>
	<div class="notablywhen" style="color: #bfbfbe">Notably, when you push to a remote repository, you do not have to push all of your branches. You can choose to share just one of your branches, a few of them, or all of them. This tends to free people to try new ideas without worrying about having to plan how and when they are going to merge it in or share it with others.There are ways to accomplish some of this with other systems.</div>
	<div class="butthe" style="color: #bfbfbe">but the work involved is much more difficult and error-prone. Git makes this process incredibly easy and it changes the way most developers work when they learn it.</div>
	<div class="thedocuement" style="color: #bfbfbe">The Documentation directory in the Git source code has several files of interest to developers who are looking to help contribute. you can learn how to submit patches. For those looking to, there is a howto for Git maintainers.</div>
	<img class="btn1img" src="C:\Users\Administrator\Desktop\demo\image-demo2\btn1.png">
	<img class="btn2img" src="C:\Users\Administrator\Desktop\demo\image-demo2\btn2.png">
	<img class="btn3img" src="C:\Users\Administrator\Desktop\demo\image-demo2\btn3.png">
	<img class="btn4img" src="C:\Users\Administrator\Desktop\demo\image-demo2\btn4.png">
</div>
<div class="dbab5"></div>
<div class="f6f5f2"></div>
</body>
</html>